<template>
  <el-card>
    <el-input class="width200" placeholder="用户名" v-model="name" clearable></el-input>
    <el-button type="primary" @click="searchList">查询订单</el-button>
    <el-button type="primary" @click="exportGas">导出加油订单</el-button>
    <el-button type="primary" @click="autoGas">autoGas</el-button>
    <el-table :data="tableData" stripe border style="margin-top: 20px">
      <el-table-column prop="out_trade_no" label="订单号">
      </el-table-column>
      <el-table-column prop="_add_time_str" label="创建时间">
      </el-table-column>
      <el-table-column prop="coupon_name" label="购买券包">
      </el-table-column>
      <el-table-column prop="sign_name" label="购买人">
      </el-table-column>
      <el-table-column prop="sign_mobile" label="电话">
      </el-table-column>
      
      <el-table-column prop="stock" label="购买数量">
      </el-table-column>
      <el-table-column prop="price" label="购买价格">
      </el-table-column>
      <el-table-column prop="pay_type" label="支付方式">
      </el-table-column>
      <el-table-column prop="pay_img" label="转账图片">
        <template slot-scope="scope">
          <image :src="scope.row.pay_img" style="width: 60px;height: 30px;cursor: pointer"
            @click="preview(scope.row.pay_img)" />
        </template>
      </el-table-column>
      <el-table-column prop="price" label="订单状态">
        <template slot-scope="scope">
          <span>{{ scope.row.status == 1 ? '已支付': '待审核' }}</span>
        </template>
      </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button v-if="scope.row.status == 2" size="mini" @click="handleEdit(scope.$index, scope.row)">审核通过</el-button>
          <el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage"
      :page-sizes="[100, 200, 300, 400]" :page-size="100" layout="total, sizes, prev, pager, next, jumper"
      :total="total">
    </el-pagination>
    <el-dialog :visible.sync="isPreview" :close-on-click-modal="true" width="60%">
      <div style="text-align: center;">
        <image :src="url" />
      </div>
    </el-dialog>
  </el-card>
</template>

<script>
  export default {
    data() {
      return {
        name: '',
        statusArr: [{
            label: '使用中',
            value: 1
          },
          {
            label: '已下架',
            value: 2
          }
        ],
        isPreview: false,
        url: '',
        currentPage: 1,
        pageNum: 1,
        pageSize: 100,
        total: 0,
        isorder: false,
        tableData: [],
      }
    },
    mounted() {
      this.getList()
    },
    methods: {
      exportGas() {
        
      },
      async autoGas() {
        let info = await vk.callFunction({
          url: 'client/timedTask/pub/autoGas',
        })
      },
      returnDate(date) {
        return vk.pubfn.timeFormat(date,"yyyy-MM-dd hh:mm:ss");
      },
      preview(item) {
        this.url = item
        this.isPreview = true
      },
      handleSizeChange(val) {
        console.log(`每页 ${val} 条`);
        this.pageSize = val
        this.getList()
      },
      handleCurrentChange(val) {
        console.log(`当前页: ${val}`);
        this.pageNum = val
        this.getList()
      },
      handleEdit(index, row) {
        vk.confirm('确定要通过该订单吗', '提示', '确定', '取消', res => {
          if (res.confirm) {
            this.orderSubmit(row)
          }
        });
      },
      async orderSubmit(row) {
        // 创建合同
        let info = await vk.callFunction({
          url: 'user/kh/contractPost',
          data: {
            out_trade_no: row.out_trade_no,
            // sign_time: row.sign_time,
            expire_time: row.expire_time,
            computed_time: row.computed_time,
            effect_time: row.effect_time,
            sign_name: row.sign_name,
            sign_mobile: row.sign_mobile,
            effect_time: row.effect_time,
            stock: row.stock,
            price:row.price,
            back_price: row.back_price,
            coupon_id: row.coupon_id,
            per_bonus: row.per_bonus,
            coupon_name: row.coupon_name,
            status: 1, // 正常  2 过期  3 作废
            sign_id: row.sign_id,
            type: row.type // 券包还是加油
          }
        })
        try {
          await vk.callFunction({
            url: 'template/openapi/weixin/pub/sendMessage',
            data: {
              touser : row.openid,
              // touser: "ozCkP5dUWOaagEbS2boFSaS1TGoE",
              template_id : "L7rMKZBNmirvpJzr_N0qEJrZUoh_vBPs8Ub2jsZKT7k",
              page : "pages/contract/contract",
              obj : {
                phrase1:{
                  value:"成功"
                },
                date3:{
                  value: vk.pubfn.timeFormat(new Date(),"yyyy-MM-dd hh:mm:ss")
                },
                thing5:{
                  value:"您的券包订单已生成，请点击查看"
                },
                thing2:{
                  value:"券包购买"
                },
                time17:{
                  value: row._add_time_str
                }
              },
              miniprogram_state : "trial",
            }
          })
        }catch(err){
          console.log(err)
        }
        // 发送订阅消息
        
    
        await vk.callFunction({
          url: 'user/kh/orderPost',
          data: {
            status: 1,
            _id: row._id
          }
        })
        if (row.type == 1) {
          await vk.callFunction({
          url: 'user/kh/orderPostAfter',
          data: {
            coupon_id: row.coupon_id,
            stock: row.stock,
            sign_id: row.sign_id,
            pid: row.pid,
            contract_no: info.data
          }
        })
        }
        if (row.type == 2) {
          await vk.callFunction({
          url: 'user/kh/gasPostAfter',
          data: {
            coupon_id: row.coupon_id,
            stock: row.stock,
            sign_id: row.sign_id,
            pid: row.pid,
            contract_no: info.data
          }
        })
        }
        
        this.searchList()
      },
      handleDelete(index, row) {
        vk.confirm('确定要删除该商品吗', '提示', '确定', '取消', res => {
          if (res.confirm) {
            this.orderDelete(row)
          }
        });
      },
      orderDelete(row) {
        uni.showLoading({
          title: '加载中...'
        })
        let that = this
        vk.callFunction({
          url: 'user/kh/orderDelete',
          data: {
            _id: row._id
          },
          success: (res) => {
            if (res) {
              uni.hideLoading()
              this.getList()
            }
          }
        })
      },
      searchList() {
        this.pageNum = 1
        this.getList()
      },
      getList() {
        uni.showLoading({
          title: '加载中...'
        })
        let obj = {}
        if (this.name) {
          obj.sign_name = this.name
        }
        vk.callFunction({
          url: 'user/kh/orderList',
          data: {
            pageNum: this.pageNum,
            pageSize: this.pageSize,
            ...obj
          },
          success: (res) => {
            if (res) {
              uni.hideLoading()
              this.tableData = res.rows
              this.total = res.total
            }
          }
        })
      },
      onSubmit() {
        uni.showLoading({
          title: '加载中...'
        })
        vk.callFunction({
          url: 'user/kh/orderPost',
          data: this.order,
          success: (res) => {
            if (res) {
              uni.hideLoading()
              console.log(res)
              this.isorder = false
              this.getList()
            }
          }
        })
      },
    }
  }
</script>

<style lang="scss" scoped>
  /deep/.el-tabs__new-tab {
    margin-right: 12px !important
  }

  .width400 {
    width: 400px
  }

  .width200 {
    width: 200px
  }

  .width100 {
    width: 100px
  }

  .good {
    display: flex;
    align-items: center;
    margin-top: 10px;

    &-img {
      width: 30px;
      height: 30px;
      border-radius: 4px;
    }

    &-name {
      margin-left: 10px;
    }

    &-price {
      color: #f56c6c;
      font-weight: 500;
      margin-left: 10px;
      margin-right: 10px;
    }
  }
</style>